<template>
    <el-dialog :append-to-body="true"
               :visible.sync="showConfirmModal"
               width="30%"
               :close-on-press-escape="false"
               :close-on-click-modal="false"
               :show-close="false"
               center>
        <div slot="title">
            <h4>提示</h4>
        </div>
        <div class="confirm-text"><i class="el-icon-warning confirm-icon"></i> {{warnText}}</div>
        <div slot="footer" class="dialog-footer">
            <div class="row" style="text-align: center">
                <a class="revision-btn-default" href="javaScript:void(0)" @click="$emit('closeModal')">取 消</a>
                <a class="revision-btn" style="margin-left: 10px;" href="javaScript:void(0)"
                   @click="$emit('submitModal')">确 定</a>
            </div>
        </div>
    </el-dialog>
</template>

<script>
    export default {
        name: "confirmModal",
        props: {
            showConfirmModal: {
                type: Boolean,
                default: false
            },
            isSingle: {
                type: Boolean,
                default: false
            }
        },
        data() {
            return {
                warnText: "此操作将永久删除所选择的记录, 是否继续?",
            };
        },
        mounted: function () {
            if (this.isSingle) {
                this.warnText = "此操作将永久删除该条记录, 是否继续?";
            }
        },
        methods: {}
    }
</script>

<style scoped>
    .confirm-text {
        text-align: center;
    }

    .confirm-icon {
        color: #E6A23C;
        font-size: 20px
    }
</style>
